<template>
  <div>
    <el-button type="warning" @click="add">添加</el-button>
    <el-button type="danger">批量删除</el-button>
    <!-- 弹出框 -->
    <add-classfy  ref="addchild"
      :classfyadd="classfyadd"
      :classfylist="classfylist"
      @getclassfyList="getclassfyList"
    ></add-classfy>
    <!-- 表格 -->
    <classfy-form
      :classfylist="classfylist"
      @getclassfyList="getclassfyList"
      @editClassfy="editClassfy"
    ></classfy-form>
  </div>
</template>

<script>
import addClassfy from "./components/addclassify.vue";
import classfyForm from "./components/classfyform.vue";

export default {
  props: {},
  data() {
    return {
        classfyadd:{  // 弹出框状态
            flag: false
        },
        classfylist:[]
    };
  },
  computed: {},
  created() {
    this.getclassfyList()
  },
  mounted() {},
  watch: {},
  methods: {
    add(){  // 弹出框状态
        this.classfyadd.flag = true
    },
    getclassfyList(){  // 分类列表
        this.$api.getcatelist({istree:true}).then((res)=>{
            this.classfylist = res.data.list
            console.log(this.classfylist);
        })
    },
    editClassfy(val){//编辑分类
      console.log(val);
      // let obj = {}
      if(val.children){
         delete (val.children);
      }
      this.$refs.addchild.form = JSON.parse(JSON.stringify(val));
      this.$refs.addchild.imageUrl = 'http://localhost:3000' + val.img
      // this.$refs.addchild.imageUrl = 'https://api.aslegou.top' + val.img

      this.classfyadd.flag = true
    }
  },
  components: {
    addClassfy,
    classfyForm,
  },
};
</script>

<style scoped lang="scss">
</style>
